<template>
<div class="">
<criteria partial='criteria' @show-con = "pocon" v-ref:cri>
<div class= "form-horizontal" partial>
  <div class="col-sm-11 "  style="margin-top:10px;">
    <label for="f_meternumber" class="col-sm-2 control-label">旧表号:</label>
    <div class="col-sm-2">
      <input type="text" class="form-control" v-model="model.f_meternumber" condition="t.f_meternumber ='{}'"  placeholder="旧表号"/>
    </div>
    <label for="f_newmeternumber" class="col-sm-2 control-label">新表号:</label>
    <div class="col-sm-2">
      <input type="text" class="form-control" v-model="model.f_newmeternumber"  condition="t.f_newmeternumber ='{}'" placeholder="新表号"/>
    </div>
    <label for="f_changemeter_type" class="col-sm-2 control-label">换表类型:</label>
    <div class="col-sm-2">
      <v-select id="f_changemeter_type"
      v-model="model.f_changemeter_type"
      placeholder='请选择'
      condition="t.f_changemeter_type ='{}'"
      :value.sync="model.f_changemeter_type"
      :options='$parent.changemeterType'
      close-on-select clear-button>
      </v-select>
    </div>
  </div>
  <div class="col-sm-11 "  style="margin-top:10px;">
    <label for="f_changemeter_fee" class="col-sm-2 control-label">换表表费:</label>
    <div class="col-sm-6">
      <v-input :value.sync="$parent.f_changemeter_fee" :expression.sync = 'model.f_changemeter_fee' condition="t.f_changemeter_fee {}" v-model="model.f_changemeter_fee" v-ref:changemeterfee><v-input>
    </div>
    <label for="f_changemeter_state" class="col-sm-2 control-label">换表状态:</label>
    <div class="col-sm-2">
      <v-select id="f_changemeter_state"
      v-model="model.f_changemeter_state"
      placeholder='请选择'
      condition="t.f_changemeter_state ='{}'"
      :value.sync="model.f_changemeter_state"
      :options='$parent.changemeterState'
      close-on-select clear-button>
      </v-select>
    </div>
  </div>
</div>
</criteria>
</div>
</template>
<script>
import AppData from '../../../../../stores/AppData'
export default {
  data () {
    return {
      arr: [],
      condition: '',
      f_changemeter_fee: ''
    }
  },
  methods: {
    reset () {
      this.$refs.cri.model.f_meternumber = ''
      this.$refs.cri.model.f_newmeternumber = ''
      this.$refs.cri.$refs.changemeterfee.data = ''
      this.$refs.cri.$refs.changemeterfee.symbol = ''
      this.$refs.cri.model.f_changemeter_type = ''
      this.$refs.cri.model.f_changemeter_state = ''
    },
    pocon () {
      let model = this.$refs.cri.model
      this.arr = []
      this.addElement(model.f_meternumber, '旧表号', 'f_meternumber')
      this.addElement(model.f_newmeternumber, '新表号', 'f_newmeternumber')
      this.addVinputElement(this.f_changemeter_fee, model.f_changemeter_fee, '卡费', 'f_changemeter_fee')
      this.addSelectElement(model.f_changemeter_type, '换表类型', 'f_changemeter_type')
      this.addSelectElement(model.f_changemeter_state, '换表状态', 'f_changemeter_state')
      this.$dispatch('showcond', this.arr)
    },
    addElement (value, chineseColumn, englishColumn) {
      if (value && value !== '') {
        this.arr.push({content: `${chineseColumn}:${value}`, culmn: englishColumn})
      }
    },
    addSelectElement (value, chineseColumn, englishColumn) {
      if (value && value.length > 0 && value[0] !== '') {
        this.arr.push({content: `${chineseColumn}:${value}`, culmn: englishColumn})
      }
    },
    addVinputElement (value, value2, chineseColumn, englishColumn) {
      if (value && value2 !== '') {
        this.arr.push({content: `${chineseColumn}:${value[0][0]} ${value[1]}`, culmn: englishColumn})
      }
    },
    sort () {
      for (let key in this.$refs.cri.model) {
        let num = 0
        for (let index in this.arr) {
          if (this.arr[index].culmn !== key) {
            num++
          }
        }
        if (num === (this.arr.length)) {
          this.$refs.cri.model[key] = ''
          if (key === 'f_changemeter_fee') {
            this.$refs.cri.$refs.changemeterfee.data = ''
            this.$refs.cri.$refs.changemeterfee.symbol = ''
          }
        }
      }
    }
  },
  watch: {
    'arr': {
      deep: true,
      handler (val) {
        this.sort()
        this.$refs.cri.search()
      }
    }
  },
  computed: {
    changemeterType () {
      return [{label: '全部', value: ''}, ...AppData.getParam('换表类型')]
    },
    changemeterState () {
      return [{label: '全部', value: ''}, ...AppData.getParam('操作状态')]
    }
  }
}
</script>
